import { getBanner, getRecommendList, getVideoUrl, keyWordSearch } from "@/request/api/home";
import { login } from "@/request/api/login";
import { getListComment, getMusicListAll, getMusicListDetail, getMusicLyric } from "@/request/api/musicListDetail";
import { createStore } from "vuex";

export default createStore({
    state: {
        isLogin: false,
        userInfo: {
            userName: '',
            id: '',
        },
        banners: [{
            pic: '',
            bannerId: ''
        }], // 轮播图
        recommendList: [{
            id: '',
            name: '',
            picUrl: '',
            playCount: ''
        }], // 推荐歌单列表
        musicListDetail: {
            coverImgUrl: '',
            name: '',
            creator: { avatarUrl: '', nickname: '', },
            description: '',
            commentCount: '',
            shareCount: '',
            subscribedCount: '',
            id: ''
        }, // 歌单详情
        musicListAll: [{
            id: '',
            name: '',
            ar: [{
                name: '',
                id: ''
            }],
            mv: '',
            al: {
                picUrl: ''
            }
        }], // 歌单所有歌曲详情
        playList: [{
            id: '',
            name: '',
            ar: [{
                name: '',
                id: ''
            }],
            al: {
                picUrl: ''
            }
        }], // 当前播放列表
        playListIndex: 0, // 当前播放歌曲下标
        isPlaying: false, // 是否播放
        songDetailShow: false, // 是否显示歌曲详情页
        musicLyric: '', // 歌曲歌词
        musicLyricShow: true, // 是否显示歌曲歌词
        currentTime: 0, // 当前播放的时间
        duration: 0, // 当前歌曲总时长
        videoDetailShow: false, // 是否显示视频详情页
        videoUrl: '', // 视频地址
        footerMusicShow: true, // 是否显示底部播放器
        playListShow: false, // 是否展示播放列表
    },
    getters: {
        playingDetail: state => {
            return state.playList[state.playListIndex]
        },
        lyricDetail: state => {
            let arr: { time: string | number; pre: number }[] = [];
            if (state.musicLyric) {
                arr = state.musicLyric.split(/[(\r\n)\r\n]+/).map(item => {
                    let min = item.slice(1, 3)
                    let sec = item.slice(4, 6)
                    let mill = item.slice(7, 10)
                    let lrc = item.slice(11, item.length)

                    if (isNaN(Number(mill))) {
                        mill = item.slice(7, 9)
                        lrc = item.slice(10, item.length)
                    }
                    let time = parseInt(min) * 60 * 1000 + parseInt(sec) * 1000 + parseInt(mill)
                    return { min, sec, mill, lrc, time, pre: 0 }
                })
                arr.forEach((item, i) => {
                    if (i === arr.length - 1 || isNaN(+arr[i + 1].time)) {
                        item.pre = 0;
                    } else {
                        item.pre = +arr[i + 1].time
                    }
                })

            }
            return arr;
        }
    },
    mutations: {
        updateIsLogin: (state, value) => {
            state.isLogin = true
        },
        updateUserInfo: (state, value) => {
            state.userInfo = value
        },
        updateBanners: (state, value) => {
            state.banners = value
        },
        updateRecommendList: (state, value) => {
            state.recommendList = value
        },
        updateMusicListDetail: (state, value) => {
            state.musicListDetail = value
        },
        updateMusicListAll: (state, value) => {
            state.musicListAll = value
        },
        updatePlayList: (state, value) => {
            state.playList = value
            state.footerMusicShow = true
            window.sessionStorage.setItem('musicId', state.playList[state.playListIndex].id)
        },
        updatePlayListIndex: (state, value) => {
            state.playListIndex = value
            state.footerMusicShow = true
            window.sessionStorage.setItem('musicId', state.playList[state.playListIndex].id)
        },
        updateIsPlaying: (state, value) => {
            state.isPlaying = value
        },
        updateSongDetailShow: (state, value) => {
            state.songDetailShow = value
        },
        updateMusicLyric: (state, value) => {
            state.musicLyric = value
        },
        updateMusicLyricShow: (state, value) => {
            state.musicLyricShow = !state.musicLyricShow
        },
        updateCurrentTime: (state, value) => {
            state.currentTime = value
        },
        updateDuration: (state, value) => {
            state.duration = value
        },
        updateVideoDetailShow: (state, value) => {
            state.videoDetailShow = !state.videoDetailShow
        },
        updateVideoUrl: (state, value) => {
            state.videoUrl = value
        },
        updateFooterMusicShow: (state, value) => {
            state.footerMusicShow = value
        },
        updatePlayListShow: (state, value) => {
            state.playListShow = value
        },
        removePlayList: (state, value) => {
            let newPlayList = state.playList
            newPlayList.splice(value, 1)
            state.playList = newPlayList
            if (value < state.playListIndex) {
                state.playListIndex -= 1
            }
        },
        clearPlayList: (state, value) => {
            state.playList = [{
                id: '',
                name: '',
                ar: [{
                    name: '',
                    id: ''
                }],
                al: {
                    picUrl: ''
                }
            }],
                state.playListIndex = 0
            state.footerMusicShow = false
            state.playListShow = false
        },
    },
    actions: {
        getLogin: async (context, value) => {
            let res = await login(value);
            return res
        },
        getBanner: async (context, value) => {
            let res = await getBanner();
            return res
        },
        getRecommendList: async (context, value) => {
            let res = await getRecommendList();
            return res
        },
        getMusicListDetail: async (context, value) => {
            let res = await getMusicListDetail(value);
            return res
        },
        getMusicListAll: async (context, value) => {
            let res = await getMusicListAll(value);
            return res
        },
        getMusicLyric: async (context, value) => {
            let res = await getMusicLyric(value);
            return res
        },
        searchKeyWord: async (context, value) => {
            let res = await keyWordSearch(value.keyword, value.type);
            return res
        },
        getVideoUrl: async (context, value) => {
            let res = await getVideoUrl(value)
            return res
        }
    },
})